import { createContext, useState } from 'react';
import { Web3ReactProvider } from '@web3-react/core';
import Web3 from 'web3';

const getLibrary = (provider) => {
  return new Web3(provider);
};

export const AllContext = createContext(null);

export const AllContextProvider = ({ children }) => {
  const [chain, setChain] = useState({
    name: 'ETH',
    src: 'images/eth.png',
  });

  const [chains, setChains] = useState([
    {
      name: 'ETH',
      src: 'images/eth.png',
    },
    {
      name: 'BSC',
      src: 'images/bsc.png',
    },
    {
      name: 'TRX',
      src: 'images/TRX.png',
    },
  ]);
  const [address, setAddress] = useState('not connected');

  return (
    <AllContext.Provider value={{ chain, setChain, chains, address, setAddress }}>
      <Web3ReactProvider getLibrary={getLibrary}>{children}</Web3ReactProvider>
    </AllContext.Provider>
  );
};
